<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>   
<%@ taglib prefix="s" uri="/struts-tags" %>
<%@ taglib prefix="sj" uri="/struts-jquery-tags"%>
<%@ taglib prefix="sjg" uri="/struts-jquery-grid-tags"%> 

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<!--
/*
*
* Copyright (c) 2011 Vaulting Systems International
* 
* Permission is hereby granted, free of charge, to any person obtaining a copy 
* of this software and associated documentation files (the "Software"), to deal 
* in the Software without restriction, including without limitation the rights 
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies 
* of the Software, and to permit persons to whom the Software is furnished to do  
* so, subject to the following conditions:
*
* The above copyright notice and this permission notice shall be included in all  
* copies or substantial portions of the Software.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, 
* INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A 
* PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT 
* HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION 
* OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE  
* SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
*
*/
-->
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title><s:text name="dashboard.title" /></title>
	<sj:head jqueryui="true" jquerytheme="smoothness"  />
	
<style>
a.normalLink:link { color: #0000FF; font-size:14px;
	font-weight:bold; text-decoration: underline }
a.normalLink:visited { color: #0000FF; font-size:14px;
	font-weight:bold; text-decoration: underline }
a.normalLink:hover { color: #FF0000; font-size:14px;
	font-weight:bold; text-decoration: underline }
	
#pg_appDeviceGrid_pager {font-size:12px;font-weight:bold;}
#jqgh_appDeviceGrid_device {font-size:12px;font-weight:bold;}
#jqgh_appDeviceGrid_application {font-size:12px;font-weight:bold;}
#jqgh_appDeviceGrid_publicKey {font-size:12px;font-weight:bold;}
#jqgh_appDeviceGrid_privateKey {font-size:12px;font-weight:bold;}
#pg_resourceGrid_pager {font-size:12px;font-weight:bold;}
#jqgh_resourceGrid_resourceUri {font-size:12px;font-weight:bold;}
#jqgh_resourceGrid_device {font-size:12px;font-weight:bold;}
#jqgh_resourceGrid_application {font-size:12px;font-weight:bold;}
</style>

</head>
<body bgColor="#ffffff" leftMargin="0" topMargin="0" rightMargin="0">

        <div id="headline">
	        <h1 class="ui-state-default" style="background: none; border: none;"><s:text name="headline.title" /></h1>
	        <h4 class="ui-state-default" style="background: none; border: none;"><s:text name="headline.version" /></h4>        
	    </div>
  

    <sj:tabbedpanel id="mytabs" animate="true" collapsible="true" useSelectedTabCookie="true">
           <sj:tab id="tab1" target="tone" label="Devices"/>       
           <sj:tab id="tab2"  target="ttwo" label="Resources"/>       
           <sj:tab id="tab3"  target="tthree" label="Api Key"/>       
               
           <div id="tone"> 
           
		     <s:url id="deviceremoteurl" action="searchAppDevice"/>
		     <s:url id="deviceediturl" action="editAppDevice"/>
		     <sjg:grid
		    	id="appDeviceGrid"
		    	width="850" 
		    	cssStyle="font-size:10px;"
		    	caption="Devices"
		    	dataType="json"
		    	href="%{deviceremoteurl}"
		    	pager="true"
		    	navigator="true"
		    	navigatorAdd="false"
		    	navigatorEdit="true"
		    	navigatorEditOptions="{
		     		editCaption:'Edit Device: Generate A New Private Key',
		    		height:375,
		    		width:775,
		    		modal:true,
		    		reloadAfterSubmit:true,
		    		closeAfterEdit:true,
		 			beforeShowForm: function(form) {
										$('#device').attr('disabled', true);
										$('#device').css('color','#C8BBBE');
										$('#application').attr('disabled', true);
										$('#application').css('color','#C8BBBE');								
										$('#publicKey').attr('disabled', true);
										$('#publicKey').css('color','#C8BBBE');								
										$('#privateKey').attr('disabled', true);
										$('#privateKey').css('color','#C8BBBE');								
		                   			},
					afterSubmit:function(response, postdata) {
									return [true,'Edit successful'];
		                        }
				}"
		    	navigatorView="true"
		    	navigatorViewOptions="{
		    		caption:'Device Details',
		    		height:300,
		    		width:600,
		 			beforeShowForm: function(form) {
										$('#trv_generateNewPrivateKey').hide();  
		                         	}
				}"
		    	navigatorDelete="true"
		    	navigatorDeleteOptions="{
		    		caption:'Delete Device',
		    		height:300,
		    		width:600,
		    		modal:true,
		    		reloadAfterSubmit:true,
		    		closeAfterEdit:true,
					afterSubmit: function(response, postdata) {
									return [true,'Delete successful'];
		                         }
				}"
		    	navigatorSearch="true"
				navigatorSearchOptions="{
					height:300,
		    		width:600,
					multipleSearch:true
				}"
		    	gridModel="gridModel"
		    	rowList="10,15,20"
		    	rowNum="15"
		    	editurl="%{deviceediturl}"
		    	editinline="false"
		    	multiselect="true"
		    	viewrecords="true"
		    >
		    	<sjg:gridColumn 
		    		name="id" 
		    		index="id" 
		    		title="ID" 
		    		hidden="true"
		    		key="true"
		    		formatter="integer" 
		    		sortable="false" />
		    	<sjg:gridColumn  
		    		cssStyle="font-size:10px;"
		    		name="device" 
		    		index="device" 
		    		title="Device" 
		    		editable="true" 
		    		edittype="text" 
		    		sortable="true" 
		    		search="true" 
		    		searchoptions="{sopt:['eq','cn','bw','ew','le','lt','ge','gt','ne']}"/>
		    	<sjg:gridColumn  
		    		cssStyle="font-size:10px;"
		    		name="application" 
		    		index="application" 
		    		title="Application" 
		    		editable="true" 
		    		edittype="text" 
		    		sortable="true" 
		    		search="true" 
		    		searchoptions="{sopt:['eq','cn','bw','ew','le','lt','ge','gt','ne']}"/>
		       	<sjg:gridColumn  
		       		cssStyle="font-size:10px;"
		    		name="publicKey" 
		    		index="publicKey" 
		    		title="Public Key" 
		     		sortable="false" 
		     		editable="true" 
		     		editoptions="{size:50,maxlength:50}"
		     		/>
		    	<sjg:gridColumn  
		    		cssStyle="font-size:10px;"
		    		name="privateKey" 
		    		index="privateKey" 
		    		title="Private Key" 
		    		sortable="false" 
		    		editable="true" 
		    		editoptions="{size:50,maxlength:50}"
		    		/>
		     	<sjg:gridColumn  
		    		name="generateNewPrivateKey" 
		    		index="generateNewPrivateKey" 
		    		title="Generate New Private Key" 
		    		hidden="true"
		    		editable="true" 
		    		edittype="checkbox"
		    		editoptions="{value:'Yes:No'}"
		    		editrules="{ edithidden : true }"
		    		sortable="false" />   		
		    		
		     </sjg:grid>
		     

 		   </div>       
           <div id="ttwo"> 
			    <s:url id="resourceremoteurl" action="searchResource"/>
			    <s:url id="resourceediturl" action="editResource"/>
			     <sjg:grid
			    	id="resourceGrid"
			    	width="850"
			    	cssStyle="font-size:10px;"
					caption="Resources"
			    	dataType="json"
			    	href="%{resourceremoteurl}"
			    	pager="true"
			    	navigator="true"
			    	navigatorAdd="false"
			    	navigatorEdit="false"
			    	navigatorView="true"
			    	navigatorViewOptions="{
			    		caption:'Resource Details',
			    		height:300,
			    		width:600
					}"
			    	navigatorDelete="true"
			    	navigatorDeleteOptions="{
			    		caption:'Delete Device',
			    		height:300,
			    		width:600,
			    		modal:true,
			    		reloadAfterSubmit:true,
			    		closeAfterEdit:true,
						afterSubmit: function(response, postdata) {
										return [true,'Delete successful'];
			                         }
					}"
			    	navigatorSearch="true"
					navigatorSearchOptions="{
						height:300,
		    			width:600,
						multipleSearch:true
					}"
			    	gridModel="gridModel"
			    	rowList="10,15,20"
			    	rowNum="15"
			    	editurl="%{resourceediturl}"
			    	editinline="false"
			    	multiselect="true"
			    	viewrecords="true"
			    >
			    	<sjg:gridColumn 
			    		name="id" 
			    		index="id" 
			    		title="ID" 
			    		hidden="true"
			    		key="true"
			    		formatter="integer" 
			    		sortable="false" />
			    	<sjg:gridColumn 
			    		cssStyle="font-size:10px;"
			    		name="resourceUri" 
			    		index="resourceUri" 
			    		title="Resource Uri" 
			    		editable="true" 
			    		edittype="text" 
			    		sortable="true" 
			    		search="true" 
			    		searchoptions="{sopt:['eq','cn','bw','ew','le','lt','ge','gt','ne']}"/>
			    	<sjg:gridColumn 
			    		cssStyle="font-size:10px;"
			    		name="device" 
			    		index="device" 
			    		title="Device" 
			    		editable="true" 
			    		edittype="text" 
			    		sortable="true" 
			    		search="false" />
			    	<sjg:gridColumn 
			    		cssStyle="font-size:10px;"
			    		name="application" 
			    		index="application" 
			    		title="Application" 
			    		editable="true" 
			    		edittype="text" 
			    		sortable="true" 
			    		search="false" />
			    		
			     </sjg:grid>
		   </div>     
		   
		   <div id="tthree">
            	<br /><br />
            	<s:text name="vendor.profile.apiKey" />:&nbsp;<s:property value="apiKey" />
            	<br /><br />
           </div>   
		   
           </sj:tabbedpanel> 


      <div align="center" class="ui-state-default">
        <s:text name="footer.copy" /><br/>
        <a class="normalLink" href='<s:url value="/j_spring_security_logout"/>'><s:text name="logout.label" /></a>
      </div>

</body>

</html>